<template>
    <el-form ref="loginRefForm" :model="userDetail" label-width="20%">
        <el-form-item label="ID:">
            <div class="detail">&nbsp;{{ userDetail.id }}</div>
        </el-form-item>
        <el-form-item label="账号:">
            <div class="detail">&nbsp;{{ userDetail.loginAct }}</div>
        </el-form-item>
        <el-form-item label="密码:">
            <div class="detail">&nbsp;{{ password }}</div>
        </el-form-item>
        <el-form-item label="姓名:">
            <div class="detail">&nbsp;{{ userDetail.name }}</div>
        </el-form-item>
        <el-form-item label="联系电话:">
            <div class="detail">&nbsp;{{ userDetail.phone }}</div>
        </el-form-item>
        <el-form-item label="邮箱:">
            <div class="detail">&nbsp;{{ userDetail.email }}</div>
        </el-form-item>
        <el-form-item label="账号未过期:">
            <div class="detail">&nbsp;{{ userDetail.accountNoExpired === 1 ? "是" : "否" }}</div>
        </el-form-item>
        <el-form-item label="密码未过期:">
            <div class="detail">&nbsp;{{ userDetail.credentialsNoExpired === 1 ? "是" : "否" }}</div>
        </el-form-item>
        <el-form-item label="账号未锁定:">
            <div class="detail">&nbsp;{{ userDetail.accountNoLocked === 1 ? "是" : "否" }}</div>
        </el-form-item>
        <el-form-item label="账号是否可用:">
            <div class="detail">&nbsp;{{ userDetail.accountEnabled === 1 ? "是" : "否" }}</div>
        </el-form-item>
        <el-form-item label="账号创建时间:">
            <div class="detail">&nbsp;{{ userDetail.createByPO.createTime }}</div>
        </el-form-item>
        <el-form-item label="账号创建者:">
            <div class="detail">&nbsp;{{ userDetail.createByPO.name }}</div>
        </el-form-item>
        <el-form-item label="修改账号时间:">
            <div class="detail">&nbsp;{{ userDetail.editByPO.editTime }}</div>
        </el-form-item>
        <el-form-item label="修改账号者:">
            <div class="detail">&nbsp;{{ userDetail.editByPO.name }}</div>
        </el-form-item>
        <el-form-item label="最后登录时间:">
            <div class="detail">&nbsp;{{ userDetail.lastLoginTime }}</div>
        </el-form-item>
        <el-form-item label="角色列表:">
            <div class="detail">&nbsp;{{ userDetail.roleList }}</div>
        </el-form-item>
        <el-form-item label="权限列表:">
            <div class="detail">&nbsp;{{ userDetail.permissionList }}</div>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" plain @click="goBack()">返&nbsp;回</el-button>
        </el-form-item>
    </el-form>
</template>

<script>
import { doGet } from '../http/httpRequest';
import { messageTip, goBack } from '../util/util';
export default {
    name:"userView",
    mounted(){
        this.loadUserDetail();
    },
    data(){
        return {
            // 用户详情对象
            userDetail : {
                createByPO : {},
                editByPO : {}
            },
            password : "********"
        }
    },
    methods : {
        loadUserDetail(){
            // 从当前路由中获取这个动态的ID
            // this.$route.path是获取路径的方法
            let id = this.$route.params.id;
            doGet("/api/user/" + id,{}).then(resp => {
                if(resp.data.code === 200){
                    this.userDetail = resp.data.data;
                    if(!this.userDetail.createByPO){
                        this.userDetail.createByPO = {};
                    }
                    if(!this.userDetail.editByPO){
                        this.userDetail.editByPO = {};
                    }
                }
                else{
                  messageTip("网络错误","error");
                }
            })
        },
        goBack,
    }
}
</script>

<style scoped>
</style>